// wpp项目特供版登录脚本
html=`
<link href="/resources/new_pcLogin.css" rel="stylesheet" type="text/css" id="login_css">
<div class="login_container" id="go_login" style="display: none;">
    <div class="login_box" id="login_box">
        <div class="close_box">
            <img src="https://gitee.com/codevicent/website_img/raw/master/close_ico.png" onclick="close_login();">
        </div>
        <div class="login_view">
            <div class="container" id="container">
                <div class="box">
                    <div style="margin: auto; width: 100%;">
                        <h1 style="color: rgb(13, 138, 255);">Login</h1>
                    <p id="login_msg">欢迎来到CodeVicent呀~</p>
                    <form>
                        <div class="input-box">
                            <label>邮箱</label>
                            <input id="zh" type="text"/>
                        </div>
                        <div class="input-box">
                            <label>密码</label>
                            <input id="pw" type="password"/>
                        </div>
                    </form>
                    <div class="btn-box">
                        <div>
                            <button onclick="login()" id="enter_btn">登录</button>
                        </div>
                    </div>
                    <p class="change_loginCard" onclick="change_card_CVAC('register')">没有账号?去注册</p>
                    </div>
                </div>
                <div class="box" id="inf_input_box">
                    <div style="margin: auto;width: 100%;">
                        <h1 style="color: rgb(13, 138, 255);">Register</h1>
                        <p id="r_msg">是新成员！好耶！</p>
                        <div class="input-box">
                            <label>用户名</label>
                            <input autocomplete="off" id="REGusername" type="text"/>
                        </div>
                        <form>
                            <div class="input-box">
                                <label>邮箱</label>
                                <input autocomplete="off" id="REGzh" type="text"/>
                            </div>
                            <div class="input-box">
                                <label>密码</label>
                                <input autocomplete="off" id="REGpw" type="password"/>
                            </div>
                        </form>
                        <div class="input-box">
                            <label>验证码</label>
                            <input autocomplete="off" id="REGcheck" type="text"/>
                        </div>
                        <div style="height: 40px;width:100%;display: flex;">
                            <img src="" width="112" height="40" id="verifyCode_img">
                            <a class="change_loginCard" style="color:black;margin-top:auto;margin-left:10px;text-decoration:unset;font-size:12px;" href="javascript:void(0)" onclick="reload_verifyCode()">看不清？换一张</a>

                        </div>
                        <div class="btn-box">
                            <div>
                                <button onclick="register()" id="REGenter_btn">注册</button>
                            </div>
                        </div>
                        <p class="change_loginCard" onclick="change_card_CVAC('login')">已有账号?去登录</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

`
had_load_vc = false
vc_loadTime = 0
async function fit(){
    if(window.innerWidth<600){
        document.getElementById("login_box").style.width = "100vw";
        document.getElementById("login_box").style.height = "100vh";
    }else{
        document.getElementById("login_box").style.width = "30%";
        document.getElementById("login_box").style.height = "80vh";
    }
}
function change_card_CVAC(to_card) {
    const container = document.getElementById("container");
    if (to_card == "login") {
        container.style.transform = "translateX(0)"
    } else if (to_card == "register") {
        container.style.transform = "translateX(-50%)"
        load_verifyCode()
    }
}
window.addEventListener('resize', function() {
    fit()
})
window.addEventListener("DOMContentLoaded",function(){
    let login_frameBox = document.createElement("div")
    login_frameBox.innerHTML = html;
    document.body.appendChild(login_frameBox);
    fit()
})



function deal_login(loginData){
    console.log(loginData)
    document.getElementById("enter_btn").innerText="登录"
    if(loginData["success"] == true){
        if(window.USE_APP_LOGIN==true){
            window.DEAL_APP_LOGIN(loginData)
        }else{
            window.location.reload()
        }
    }else{
        document.getElementById("enter_btn").disabled=false
        document.getElementById("login_msg").style.color="red"
        document.getElementById("login_msg").innerHTML=loginData["msg"]
    }
}
async function login(){
    ukey = document.getElementById("zh").value
    pw = document.getElementById("pw").value
    document.getElementById("enter_btn").disabled=true
    document.getElementById("enter_btn").innerText="正在请求..."
    login_d = await window.pywebview.api.cv_login(ukey,pw)
    console.log(login_d)
    if(login_d["success"]==true){
        close_login()
        pack_userInf()
    }else{
        document.getElementById("enter_btn").disabled=false
        document.getElementById("login_msg").style.color="red"
        document.getElementById("login_msg").innerHTML=login_d["msg"]
    }
    document.getElementById("enter_btn").innerText="登录"
}
function deal_r(loginData){
    if(loginData["success"] == true){
        // document.getElementById("inf_input_box").style.display="none"
        // document.getElementById("email_check").style.display="flex"
        document.getElementById("REGenter_btn").innerText="注册成功！请进行邮箱验证"
    }else{
        document.getElementById("REGenter_btn").disabled=false
        document.getElementById("REGenter_btn").innerText="注册"
        document.getElementById("r_msg").style.color="red"
        document.getElementById("r_msg").innerHTML=loginData["msg"]
    }
}
function register(){
    uname = document.getElementById("REGusername").value
    check = document.getElementById("REGcheck").value
    ukey = document.getElementById("REGzh").value
    pw = document.getElementById("REGpw").value
    document.getElementById("REGenter_btn").disabled=true
    document.getElementById("REGenter_btn").innerText="正在等待验证邮件发送..."
    var reg_data = {email:ukey,code:check,name:uname,pw:pw}
    post("cv-api","/account/register/",reg_data,deal_r)
    // network("cv-api","/register?name="+uname+"&email="+ukey+"&pw="+pw+"&code="+check,deal_r)
}


function deal_vc(vdata){
    if(had_load_vc==false){
        if(vdata["success"] == true){
            document.getElementById("verifyCode_img").src=vdata["data"]["url"]
            had_load_vc=true;
        }else{
            document.getElementById("r_msg").style.color="red"
            document.getElementById("r_msg").innerHTML="错误：无法加载人机验证图"
        }
    }
}

function load_verifyCode(){
    if(had_load_vc==true){return;}
    var now_time = Date.now()
    if(now_time-vc_loadTime<5000)return
    vc_loadTime = now_time
    network("cv-api","/verifycode/",deal_vc)
}
function reload_verifyCode(){
    had_load_vc=false
    load_verifyCode()
}
function open_login(){
    document.getElementById("go_login").style.display="flex"
}
function close_login(){
    document.getElementById("go_login").style.display="none"
}
async function pack_userInf(){
    u_data = await window.pywebview.api.get_userInf()
    if(u_data["success"]==true){
        document.getElementById("user_name_bar").innerText=u_data["data"]["userName"]
    }
}

window.addEventListener('pywebviewready',async function() {
    pack_userInf()
})